<template>
  <div ref="charts"></div>
</template>

<script>
import * as echarts from "echarts";
export default {
  mounted() {
    this.echarts();
  },
  methods: {
    echarts() {
      let line = echarts.init(this.$refs.charts);
      line.setOption({
        xAxis: {
          show: false,
         min:0,
         max:100,
         
        },
        yAxis: {
          show: false,
          //均分
           type: "category",
        },
        series: {
          type: "bar",
          data: [78],
          barWidth:10,
          color:'yellowgreen',
          showBackground:true,
          backgroundStyle:{
            color:'#eee'
          },
          label:{
            show:true,
             formatter:'|',
              position:'right'
          }
      
       
        },
        grid: {
          left: 0,
          top: 0,
          right: 0,
          bottom: 0,
        },
        tooltip:{}
      });
    },
  },
};
</script>

<style scoped>
div {
  width: 100%;
  height: 100%;
}
</style>
